<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/WEB-INF/view/common/includes.jsp" %>
<%@ include file="/WEB-INF/view/inc.jsp" %>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<div class="dialog_form">
    <form  method="post" id="cookbook_add" action="/cookingSteps/saveAndUpdate" enctype="multipart/form-data"accept="image/gif, image/jpeg,image/jpg, image/png">
        <input type="hidden" name="cookbookId" value="${cookingSteps.cookbookId}"/>
        <input type="hidden" name="id" value="${cookingSteps.id}"/>
        <input id="imgs" type="hidden" value="${cookingSteps.img}">

        <div class="dialog_item">
            <label>步骤描述:</label>
            <input name="description" class="easyui-textbox" data-options="multiline:true" validType="length[1,1000]" style="width:300px;height:100px" value="${cookingSteps.description}">
        </div>
        <div class="dialog_item">
            <label>排序:</label>
            <input name="sortIndex" class="easyui-numberbox"  validType="length[1,20]" style="width:300px;height:20px" value="${cookingSteps.sortIndex}">
        </div>
        <br/>
        <div class="dialog_item">
            <label id="title">图解预览:</label>
            <div id="tpyl">
                <ul>
                    <li>
                        <div style="width: 100px;">
                            <img id="add_but" class="uploadImgButton" src="/jslib/common/images/button/add.jpg" style="width: 90px;margin-top: 10px;margin-left: 10px;" onclick="loadImg()">
                        </div>
                    </li>
                   <%-- <c:if test="${not empty cookingSteps.img }">
                        <c:set value="${fn:split(cookingSteps.img,',')}" var="imgs"></c:set>
                        <c:forEach items="${imgs}" var="img">
                            <li>
                                <div class="img_Div" id="${fn:substring(img,1,32)}" style="width:100px;">
                                    <div class="del_But_Div"  onclick="delId('${fn:substring(img,1,32)}')" style="display: none" >
                                        <img class="close" src="/jslib/common/images/button/close.png" style="width: 10px;float: right;">
                                    </div>
                                    <img class="img-square" src="/file/${img}" style="width: 100px;height: 100px;">
                                    <input name="img" type="hidden" value="${img}">
                                </div>
                            </li>
                        </c:forEach>
                    </c:if>--%>
                </ul>
            </div>
        </div>
            <input  name="fileToUpload" id="fileToUpload" type="file" multiple="true" onchange="sy_uploadImg()"  style="display: none" value="${cookbook.img}">

                <%--  <div class="img_Div" id="${fn:substring(img,1,32)}" >
                       <div class="del_But_Div"  onclick="delId('${fn:substring(img,1,32)}')" style="display: none" >
                           <img class="close" src="/jslib/common/images/button/close.png" style="width: 10px;float: right;">
                       </div>
                       <img class="img-square" src="/file/${img}" style="width: 100px;height: 110px;">
                       <input name="img" type="hidden" value="${img}">
                   </div>--%>
    </form>
</div>
</body>

<script>
$(function(){
    var imgs = $("#imgs").val();
    var imgtDiv = $("#tpyl ul");
    if(imgs!=undefined && imgs!=""){
        inserImg(imgs,imgtDiv);
    }
    loadMouseEventFun();
})
</script>

</html>
